<template>
  <div>
    <h2>ref 另一个作用： 获取页面元素</h2>
    <h3>
      <input type="text" ref="inputRef" />
    </h3>
  </div>
</template>
<script lang="ts">
import { defineComponent, onMounted, ref } from "vue";
export default defineComponent({
  name: "ref 其他作用",
  setup() {
    const inputRef = ref<HTMLElement | null>(null);

    // 页面加载成功， 采用组合 API, 自动获取 input 框输入焦点
    onMounted(() => {
      inputRef.value && inputRef.value.focus();
    });

    return {
      inputRef,
    };
  },
});
</script>
